import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:get/get.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'package:travel/model/follow.dart';
import 'package:travel/routes/index.dart';
import 'package:travel/ui/scroll_refresh_config.dart';
import 'package:travel/utils/colors.dart';
import 'package:travel/utils/styles.dart';
import 'package:travel/utils/tools.dart';
import 'package:travel/screen/flutter_screenutil.dart';

class VideoResultController extends GetxController {
  late TextEditingController textEditingController;

  RxList<FollowVideoModel> pageList = RxList([]);

  RefreshController refreshController = RefreshController();

  @override
  void onInit() {
    if (Get.arguments != null) {
      textEditingController = ToolsUtils.editingController(Get.arguments['result']);
    }
    initData();
    super.onInit();
  }

  @override
  void onClose() {
    refreshController.dispose();
    textEditingController.dispose();
    super.onClose();
  }

  void initData() {
    pageList.add(FollowVideoModel(
      avatar:
          'https://img2.baidu.com/it/u=933399434,4184962118&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
      nickname: '小妞爱游荡',
      videoUrl:
          'https://img2.baidu.com/it/u=100604233,212882188&fm=253&fmt=auto&app=138&f=JPEG?w=763&h=500',
      publishTime: '1天前',
      introduce: '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛展大搜罗 #休闲好去处…',
      address: '湖南',
    ));
    pageList.add(FollowVideoModel(
      avatar:
          'https://img2.baidu.com/it/u=933399434,4184962118&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
      nickname: '小妞爱游荡',
      videoUrl:
          'https://img2.baidu.com/it/u=1221576643,621976655&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500',
      publishTime: '1天前',
      introduce: '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛展大搜罗 #休闲好去处…',
      address: '湖南',
    ));
    pageList.add(FollowVideoModel(
      avatar:
          'https://img2.baidu.com/it/u=933399434,4184962118&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
      nickname: '小妞爱游荡',
      videoUrl:
          'https://img2.baidu.com/it/u=100604233,212882188&fm=253&fmt=auto&app=138&f=JPEG?w=763&h=500',
      publishTime: '1天前',
      introduce: '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛展大搜罗 #休闲好去处…',
      address: '湖南',
    ));
    pageList.add(FollowVideoModel(
      avatar:
          'https://img2.baidu.com/it/u=933399434,4184962118&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
      nickname: '小妞爱游荡',
      videoUrl:
          'https://img2.baidu.com/it/u=100604233,212882188&fm=253&fmt=auto&app=138&f=JPEG?w=763&h=500',
      publishTime: '1天前',
      introduce: '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛展大搜罗 #休闲好去处…',
      address: '湖南',
    ));
    pageList.add(FollowVideoModel(
      avatar:
          'https://img2.baidu.com/it/u=933399434,4184962118&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
      nickname: '小妞爱游荡',
      videoUrl:
          'https://img2.baidu.com/it/u=100604233,212882188&fm=253&fmt=auto&app=138&f=JPEG?w=763&h=500',
      publishTime: '1天前',
      introduce: '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛展大搜罗 #休闲好去处…',
      address: '湖南',
    ));
    pageList.add(FollowVideoModel(
      avatar:
          'https://img2.baidu.com/it/u=933399434,4184962118&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
      nickname: '小妞爱游荡',
      videoUrl:
          'https://img2.baidu.com/it/u=100604233,212882188&fm=253&fmt=auto&app=138&f=JPEG?w=763&h=500',
      publishTime: '1天前',
      introduce: '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛展大搜罗 #休闲好去处…',
      address: '湖南',
    ));
  }

  Future<void> onRefresh() async {
    /// 发起请求
    await Future.delayed(const Duration(milliseconds: 2000));
    refreshController.refreshCompleted(resetFooterState: true);
  }

  Future<void> onLoading() async {
    /// 发起请求
    await Future.delayed(const Duration(milliseconds: 2000));

    /// if failed, use loadFailed(), if no data return, use LoadNodata()
    if (pageList.length > 40) {
      return refreshController.loadNoData();
    }

    /// 添加数据
    pageList.add(FollowVideoModel(
      avatar:
          'https://img2.baidu.com/it/u=933399434,4184962118&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
      nickname: '小妞爱游荡',
      videoUrl:
          'https://img2.baidu.com/it/u=100604233,212882188&fm=253&fmt=auto&app=138&f=JPEG?w=763&h=500',
      publishTime: '1天前',
      introduce: '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛展大搜罗 #休闲好去处…',
      address: '湖南',
    ));
    pageList.add(FollowVideoModel(
      avatar:
          'https://img2.baidu.com/it/u=933399434,4184962118&fm=253&fmt=auto&app=138&f=JPEG?w=517&h=500',
      nickname: '小妞爱游荡',
      videoUrl:
          'https://img2.baidu.com/it/u=1221576643,621976655&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500',
      publishTime: '1天前',
      introduce: '来湖南衡阳旅游必打卡的景点 #周边游安心好去处 #城市骑行记 #逛展大搜罗 #休闲好去处…',
      address: '湖南',
    ));

    /// 完毕
    refreshController.loadComplete();
  }
}

class VideoResultView extends GetView<VideoResultController> {
  const VideoResultView({super.key});

  @override
  Widget build(BuildContext context) {
    return Obx(() => Scaffold(
          backgroundColor: Colors.white,
          appBar: AppBar(
            automaticallyImplyLeading: true,
            leading: InkWell(
              onTap: () {
                Get.back();
              },
              child: Icon(
                Icons.arrow_back_ios,
                color: ColorsUtils.parseColorFromHexString(ColorsUtils.color3333),
                size: 20.w,
              ),
            ),
            leadingWidth: 40.w,
            title: Container(
                height: 38.h,
                padding: EdgeInsets.only(left: 10.w, right: 15.w),
                decoration: BoxDecoration(
                    border: Border.all(
                        color: ColorsUtils.parseColorFromHexString(ColorsUtils.color3478)),
                    borderRadius: BorderRadius.all(const Radius.circular(20).w)),
                child: Row(
                  children: [
                    Expanded(
                        child: TextField(
                      controller: controller.textEditingController,
                      cursorWidth: 2.0,
                      cursorRadius: const Radius.circular(2),
                      cursorColor: ColorsUtils.parseColorFromHexString(ColorsUtils.color3333),
                      style: StylesUtils.customTextStyle(
                          fontSize: 15.sp, color: ColorsUtils.color3333),
                      decoration: InputDecoration(
                        prefixIcon: Icon(Icons.search_sharp, size: 25.sp),
                        prefixIconColor: Colors.black54,
                        prefixIconConstraints: BoxConstraints.expand(width: 35.w),
                        border: InputBorder.none,
                        focusedBorder: InputBorder.none,
                        hintText: '搜索你想看的',
                        contentPadding: EdgeInsets.symmetric(vertical: 13.h),
                        isCollapsed: true,
                        isDense: true,
                        hintStyle: StylesUtils.customTextStyle(
                          color: ColorsUtils.color9999,
                        ),
                      ),
                    )),
                    InkWell(
                      onTap: () {
                        controller.textEditingController.text = '';
                      },
                      child: Center(
                        child: SizedBox(
                          width: 18,
                          height: 18,
                          child: CustomPaint(
                            painter: _ClosedIcon(),
                          ),
                        ),
                      ),
                    )
                  ],
                )),
            actions: [
              Container(
                width: 40.w,
              )
            ],
          ),
          body: scrollRefreshConfig(context),
        ));
  }

  ScrollRefreshConfig scrollRefreshConfig(BuildContext context) {
    return ScrollRefreshConfig(
      refreshController: controller.refreshController,
      onRefresh: controller.onRefresh,
      onLoading: controller.onLoading,
      child: scrollViewBuilder(context),
    );
  }

  SingleChildScrollView scrollViewBuilder(BuildContext context) {
    return SingleChildScrollView(
      padding: EdgeInsets.symmetric(horizontal: 15.w),
      child: StaggeredGrid.count(
        crossAxisCount: 2,
        mainAxisSpacing: 15.w,
        crossAxisSpacing: 10.w,
        children: controller.pageList
            .map((row) => InkWell(
                  onTap: () {
                    Get.toNamed(RoutePath.videoInfo);
                  },
                  child: Column(
                    children: [
                      Stack(
                        children: [
                          Container(
                            width: 172,
                            height: 230,
                            decoration: BoxDecoration(
                                borderRadius: BorderRadius.only(
                                    topLeft: Radius.circular(10.w),
                                    topRight: Radius.circular(10.w)),
                                image: DecorationImage(
                                    image: NetworkImage(row.videoUrl), fit: BoxFit.fill)),
                          ),
                          Positioned(
                              width: 28.w,
                              height: 28.h,
                              top: 5.h,
                              right: 5.w,
                              child: CircleAvatar(
                                radius: 14.w,
                                backgroundColor: ColorsUtils.rgba(0, 0, 0, 0.698039),
                                child:
                                    ToolsUtils.assetImageSvg('u159.svg', width: 28.w, height: 28.h),
                              ))
                        ],
                      ),
                      Container(
                        margin: EdgeInsets.only(top: 10.h, bottom: 10.h),
                        alignment: Alignment.centerLeft,
                        child: Text(
                          row.introduce,
                          style: StylesUtils.customTextStyle(
                              color: ColorsUtils.color3333, lineHeight: 1.4.h),
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                        ),
                      ),
                      Row(
                        children: [
                          CircleAvatar(
                            radius: 10.w,
                            backgroundImage: NetworkImage(row.avatar),
                          ),
                          Text(
                            ' ${row.nickname}',
                            style: StylesUtils.customTextStyle(
                                color: ColorsUtils.color6666, fontSize: 12.sp),
                          )
                        ],
                      )
                    ],
                  ),
                ))
            .toList(),
      ),
    );
  }
}

class _ClosedIcon extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    Paint paint = Paint()
      ..style = PaintingStyle.fill
      ..isAntiAlias = true
      ..color = ColorsUtils.parseColorFromHexString(ColorsUtils.colorCccc);
    canvas.drawCircle(Offset(size.width / 2, size.height / 2), size.height / 2, paint);
    paint.color = Colors.white;
    paint.strokeWidth = 2.5;
    paint.style = PaintingStyle.stroke;

    canvas.drawLine(Offset(size.width / 4, size.height / 4),
        Offset(size.width * 3 / 4, size.height * 3 / 4), paint);

    canvas.drawLine(Offset(size.width / 4, size.height * 3 / 4),
        Offset(size.width * 3 / 4, size.height / 4), paint);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return this != oldDelegate;
  }
}
